import Fetch from '../modules/fetch'
import ContainerComponent from './ContainerComponent'
import indexData from './indexData'
import {Link} from 'react-router'
import Jsonp from 'jsonp'
import $ from 'jquery'

class TuijianFly extends React.Component {   
    constructor(props,context){
        super(props,context)
		this.state={
			videoTitle: [],			
			sort:{},
			idNum:this.props.location.pathname.split('/').pop() 
		}
        
    }
    componentWillMount(){

		var that = this

		this._getNewsTwo(function(news){

			news.forEach(function(item,i){

				if(item.aid==that.state.idNum){

						that.setState({
							sort:news[i]
						})

					
				}
			})
			
		})
		
		
		Fetch.Get("http://localhost:9000/cmm/recommendnew,14638041", {

        }).then(res => {
        	
			return res.text()
		}).then(text => {
			this.setState({
				videoTitle:JSON.parse(text).data
			})

		})
		
}
 
    _getNewsTwo(cb){
//  	https://api.bilibili.com/x/web-interface/ranking?rid=0&day=3&jsonp=jsonp
    	
    	Fetch.Get("http://localhost:9000/bilili/x/web-interface/ranking", {
			rid:0
        }).then(res => {
        	
			return res.json()
		}).then(json => {

			cb(json.data.list)

		})
    }
    
    
    

   showBox2Words(){
        let that = this
		let str = ''	
        
		
        	this.state.videoTitle.forEach((item,i)=>{
        		let _src = item.pic.replace("http","https")
				var addr = item.owner.face

        		if(i<8){      			
					str+= `			
							<a class="video_recommend_link">
								<img class="video_recommend_link_img" src='${_src+"@234w_146h.webp"}' />
								<p class="video_recommend_link_title">${item.title}</p>
								<p class="video_recommend_link_up">up主:  ${item.owner.name}<span></span></p>
								<div class="video_recommend_link_play"><div>播放 : ${item.stat.view}<span></span></div><div>弹幕 : ${item.stat.danmaku}<span></span></div></div>
							</a>		
							<hr/>
						`		    		
        		}   
        		$(".imgId").attr('src','lib/images/p4.jpg'); 
	        })
			$('.video_recommend').html(str)
			
    }
   

    
   changeTowhat2(){
		$(location).attr('href', '#/');
	}
   changeTowhat(){
		$(location).attr('href', '#/reg');
	}
    
    
    render() {
		return (
			
			
			<div className="video_container">			
         	<div className="header-swipper">		
					<div className="header-top">
			    		<img src="./lib/images/logo.png" alt="" className="header-top__logo" onClick={this.changeTowhat2}/>
			    		<div className="header-top__right">
			    			<img src="./lib/images/tv_icon.gif" alt="" className="userBox_pic"/>
			    			<p onClick={this.changeTowhat}>注册</p>
			    		</div>
			    	</div>
				</div>
				
				<img src='./lib/images/p3.jpg' className='ccc'/>
				<div className="video_share">
					<a>分享</a>
					<a>收藏</a>
					<a>缓存</a>
				</div>
				
				<div className="video_title" >
					<Link to={"/info/"+this.state.sort.aid}>
						<h3>{this.state.sort.title}</h3>
						<div className="video_number">
							<p><span className="iconfont icon-shipin"></span><span>{this.state.sort.play}</span><span className="iconfont icon-mulu"></span><span>{this.state.sort.video_review}</span></p>
						</div>
						<div className="video_info">{this.state.sort.title}</div>
					</Link>
				</div>
				
				<div className="video_attention" >
					<Link to={"/info/"+this.state.sort.aid}>
						<img src='' className='imgId'/>
						<div><a className='bbb'>{this.state.sort.author}</a><p>三天前投</p></div>
						<a className="video_attention_button">关注</a>
					</Link>
				</div>
				<div className="video_tag">
					<h3>相关标签</h3>
					<a>NO GAME NO LIFE</a>
					<a>AMV</a>
					<a>游戏人生</a>
					<a>游戏人生剧场版</a>
				</div>
				
				<div className="video_recommend">

					{this.showBox2Words()}
					
				</div>
			</div>
		)
	}
    componentDidUpdate() {

        $(".video_recommend_link_img").each((index, item)=>{
            $(item).on("error", ()=>{
                $(item).attr("src", "./lib/images/403.png")
            })
        })
    }
}
//定义默认属性
TuijianFly.defaultProps={

}



export default TuijianFly